/*---------------------- 样式重置 ---------------------------*/
html {
    width: 100%;
    height: 100%;
    -webkit-user-select: none;
    user-select: none;
    position: relative;
}

* {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
}

body {
    width: 100%;
    height: 100%;
    max-width: 24rem;
    margin: 0 auto;
    position: relative;
    font-size: 0.625rem;
    font-family: "Microsoft Yahei", 'Arial', sans-serif;
    word-break: break-all;
    overflow-x: hidden;
    padding: 0;
    color: #333;
}

b, dd, div, dl, dt, form, img, input, li, p, select, span, ul, textarea {
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box; /* Firefox */
    -webkit-box-sizing: border-box; /* Safari */
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
    padding: 0;
    border: 0;
    font-weight: normal;
    font-size: 0.75rem;
}

em, i {
    font-style: normal
}

.fll {
    float: left
}

.frr {
    float: right
}

img {
    vertical-align: top;
    -webkit-transition: .5s ease;
    -moz-transition: .5s ease;
    transition: .5s ease;
    -ms-transition: .5s ease
}

a {
    text-decoration: none;
    cursor: pointer;
    color: #333;
    -webkit-transition: .5s ease;
    -moz-transition: .5s ease;
    transition: .5s ease;
    -ms-transition: .5s ease
}

a:hover {
    cursor: pointer;
    text-decoration: none;
}

.clearfix:before, .clearfix:after {
    content: '';
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

/*table表格重置*/
table {
    border-collapse: collapse;
    border-spacing: 0;
}

textarea {
    font-family: Verdana, Arial, "Microsoft Yahei" !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    resize: none;
}

/*兼容苹果手机UI按钮元素*/
input[type="submit"], input[type="reset"], input[type="button"], input[type="file"], input[type='checkbox'] button {
    -webkit-appearance: none;
    appearance: none;
}

.bodybg {
    width: 100%;
    min-height: 100%;
    height: auto;
    float: left;
    background: #71d8f4;
    padding: 0.32rem;
    position: relative;
    overflow: hidden;
}

.logo {
    position: absolute;
    top: 0.7rem;
    padding-left: 0.1rem;

}

.name {
    position: absolute;
    right: 0.75rem;
    top: 0.75rem;
    line-height: 2rem;
    font-size: 0.75rem;
    color: #043d7f;
    font-weight: bold;
}
.logo img {
    width: 6.8125rem;
}

.machine {
    width: 100%;
    float: left;
    min-height: 100%;
    height: auto;
    position: relative;
    margin-top: 2.2rem;
}

.machine img {
    max-width: 100%;
    position: relative;
    margin-top: -2.2rem;
}

.go_btn {
    width: 7rem;
    height: 5.90625rem;
    background: url("../images/btn1.png") no-repeat center center / 7rem;
    position: absolute;
    bottom: 8.2rem;
    z-index: 2;
    left: 50%;
    margin-left: -3.5rem;
}

.go_active {
    background: url("../images/btn2.png") no-repeat center center / 7rem;
    bottom: 7.3rem;
}

.btn {
    width: 100%;
    float: left;
    text-align: center;
    position: absolute;
    bottom: 1.8rem;
    z-index: 4;
}

.btn .go_link {
    width: 7.5rem;
    height: 3.84375rem;
    display: inline-block;
    background: url("../images/go_black.png") no-repeat center center / 7.5rem;
    margin-right: 0.75rem;
}

.btn .share {
    background: url("../images/share.png") no-repeat center center / 7.5rem;
}

.prize {
    width: 10.8rem;
    background: url("../images/prize.png") no-repeat center center / 10.8rem;
    float: left;
    position: absolute;
    left: 50%;
    margin-left: -5.4rem;
    top: 12.6rem;
    z-index: 9;
    display: none;
}

.prize_txt {
    width: 100%;
    float: left;
    display: none;
}

.prize_txt h3 {
    font-size: 1rem;
    font-weight: bold;
    color: #ed1a37;
    text-align: center;
    padding-top: 2rem;
}

.prize_txt p {
    font-size: 0.75rem;
    line-height: 0.9rem;
    color: #d63537;
    text-align: center;
    padding-top: 1.2rem;
}

.prize_yes {
    width: 100%;
    float: left;
    height: 7.15625rem;
}

.prize_yes .prize_top {
    width: 100%;
    float: left;
    position: relative;
    padding-left: 3.5rem;
}

.prize_yes .prize_top img {
    width: 2rem;
    float: left;
    position: absolute;
    left: 1rem;
    top: 3rem;
}

.prize_yes .prize_top h3 {
    font-size: 1.5rem;
    font-weight: bold;
    color: #ed1a37;
    letter-spacing: 5px;
    line-height: 1.5rem;
    padding-top: 0.4rem;
}

.prize_yes .prize_top p {
    font-size: 0.625rem;
    color: #ed1a37;
    margin: 0.32rem 0;
    line-height: 0.625rem;
}

.prize_yes .prize_top span {
    font-size: 0.75rem;
    font-weight: bold;
    color: #ed1a37;
    letter-spacing: 3px;
    line-height: 0.75rem;
}

.prize_yes .ties {
    width: 100%;
    float: left;
    font-size: 0.75rem;
    line-height: 0.9rem;
    color: #d63537;
    text-align: center;
    padding-top: 0.6rem;
}

/*用户提交*/
.userbg {
    width: 100%;
    float: left;
    z-index: 101;
    padding-left: 0.625rem;
    margin-top: 3rem;
    position: relative;
}

.userbg img {
    max-width: 100%;
}

.userbg .usercont {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    padding: 3.5rem 3rem 0 3rem;
}

.userbg .usercont h2 {
    font-size: 0.875rem;
    font-weight: bold;
    color: #00377a;
    line-height: 1.5rem;
    letter-spacing: 5px;
}

.userbg .usercont h2 i {
    padding: 0 0.32rem;
}

.form_li {
    width: 100%;
    float: left;
    height: 1.2rem;
    position: relative;
    padding-left: 3.2rem;
    margin-top: 1rem;
}

.form_li label {
    position: absolute;
    left: 0;
    top: 0;
    font-size: 1rem;
    font-weight: bold;
    color: #c40a20;
    letter-spacing: 2px;
}

.form_inpt {
    width: 100%;
    float: left;
    height: 1.2rem;
}

.form_inpt input {
    width: 100%;
    height: 100%;
    border-bottom: 2px solid #113770;
    outline: none;
    color: #333;
    background: none;
    border-radius: inherit;
}

.li2 {
    padding-left: 5.2rem;
}

.subitm {
    width: 100%;
    float: left;
    text-align: center;
    margin-top: 1rem;
    padding-left: 2rem;
}

.subitm .Btt {
    width: 9.125rem;
    height: 3.25rem;
    text-align: center;
    background: url("../images/subtn.png") no-repeat center center / cover;
    outline: none;
    border: none;
    font-weight: bold;
    font-size: 1rem;
    line-height: 1rem;
    letter-spacing: 5px;
    color: #00377a;
}

.subitm .Btt i {
    position: relative;
    top: -0.2rem;
}

.link_btn {
    width: 100%;
    float: left;
    text-align: center;
    position: absolute;
    bottom: 1.8rem;
    z-index: 101;
}

.link_btn .go_block {
    width: 5.375rem;
    height: 2.5rem;
    background: url("../images/linkbg.png") no-repeat center center / 5.375rem;
    display: inline-block;
    text-align: center;
    line-height: 2.2rem;
    font-size: 0.875rem;
    color: #00377a;
}

.link_btn .share {
    margin-left: 2rem;
}

/*尾部元素*/
.botmbg {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 99;
}

.botmbg img {
    width: 100%;
}

body .layui-m-layer .layui-m-layer-msg {
    bottom: -50%;
}

/*目录*/
.wapbg {
    width: 100%;
    float: left;
    min-height: 100%;
    height: auto;
    background: url("../images/bg2.png") no-repeat left bottom / 100% 100%;
    padding: 1rem 1rem 0 1rem;
}

.wapbg .logo {
    width: 100%;
    position: inherit;
}

.wapbg .logo .frr {
    line-height: 2rem;
    font-size: 0.75rem;
    color: #535353;
    font-weight: bold;
}

.catalogbox {
    width: 100%;
    float: left;
    margin-top: 1.5rem;
    padding-bottom: 1rem;
}

.catalogTp {
    width: 100%;
    float: left;
    text-align: center;
    margin-bottom: 0.625rem;
}

.catalogTp img {
    width: 12rem;
}

.catalogbox ul li {
    width: 100%;
    float: left;
    margin-top: 0.625rem;
}

.catalogbox ul li h1 {
    font-weight: bold;
    font-size: 0.75rem;
    color: #00367a;
    padding-left: 1rem;
}

.catalogbox ul li .cataloglist {
    width: 100%;
    float: left;
}

.catalogbox ul li .cataloglist span {
    width: 33.33%;
    float: left;
    margin-top: 0.625rem;
    text-align: center;
}

.catalogbox ul li .cataloglist span a {
    width: 4.5rem;
    height: 1.8125rem;
    border-radius: 20px;
    background: #0068b7;
    display: inline-block;
    text-align: center;
    line-height: 1.8125rem;
    color: #fff;
    font-size: 0.75rem;
}

/*方案*/
.progbg{
    background: url("../images/bg3.png")no-repeat left bottom / cover;
}
.ProgTp {
    width: 100%;
    float: left;
    text-align: center;
    margin-top: 3.625rem;
}

.ProgTp h3 {
    font-size: 2rem;
    color: #00367a;
    font-weight: lighter;
}

.ProgTp h3 i {
    color: #333;
}

.Ticknumber {
    width: 100%;
    float: left;
    text-align: center;
    margin-top: 2.5rem;
}

.Ticknumber .bord {
    width: 14.6875rem;
    height: 2.875rem;
    border: 1px dashed #7cb1d8;
    display: inline-block;
    padding: 0.5rem;
}

.Ticknumber .bord span {
    width: 100%;
    height: 100%;
    background: #0068b7;
    float: left;
    text-align: center;
    line-height: 1.775rem;
    font-weight: bold;
    font-size: 0.875rem;
    color: #fff;
}

.operation {
    width: 100%;
    float: left;
    margin-top: 1.5rem;
}

.operation span {
    width: 50%;
    float: left;
    text-align: center;
}

.operation span img {
    width: 3.90625rem;

}

.Progcont {
    width: 100%;
    float: left;
}

.Progcont .title {
    width: 100%;
    float: left;
    padding: 0 1.5rem;
    font-size: 0.75rem;
    line-height: 1.5rem;
    color: #5d7ca4;
    text-indent: 2em;
    margin-top: 1rem;
    letter-spacing: 1px;
}

.Progcont .title b {
    color: #5d7ca5;
}

.Img {
    width: 100%;
    float: left;
    text-align: center;
    margin-top: 2.8125rem;
    padding: 0 1rem;
    position: relative;
}

.Img span {
    width: 100%;
    height: 10.78125rem;
    border: 2px solid #556fb5;
    display: inline-block;
    position: relative;
    z-index: 999;

}

.Img span img {
    width: 100%;
    height: 100%;

}

.Img span:after {
    content: '';
    width: 2.40625rem;
    height: 2.34375rem;
    background: url("../images/jiao.png") no-repeat center center / 2.40625rem;
    position: absolute;
    left: -0.5rem;
    top: -0.5rem;
    float: left;
}

.Img span:before {
    content: '';
    width: 2.40625rem;
    height: 2.34375rem;
    background: url("../images/jiao.png") no-repeat center center / 2.40625rem;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    position: absolute;
    right: -0.5rem;
    bottom: -0.5rem;
    float: left;
}

.Progcont h1 {
    text-align: center;
    font-size: 0.625rem;
    margin-top: 1.2rem;
    float: left;
    width: 100%;
}
.Img2{
    margin-top: 1.5rem;

}
.Img2 span{
    height: 9.5625rem;
}
.Img2 span:after{
    right: -0.5rem;
    left: auto;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
}
.Img2 span:before{
    right:auto;
    left: -0.5rem;
    transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -o-transform: rotate(270deg);
}

.Progcont p{
    padding:0 1rem;
    width: 100%;
    float: left;
    font-size: 0.625rem;
    line-height: 1.2rem;
    margin-top: 2rem;
}

.Prigbtn{
    width: 100%;
    float: left;
    text-align: center;
    margin-top: 3.5rem;
    padding-bottom: 14.25rem;
}

.Prigbtn span{
    width: 50%;
    float: left;
    text-align: center;
}
.Prigbtn span img{
    width: 5.6875rem;
}

.close {
    position: absolute;
    right: 1.5rem;
    top: 0.75rem;
}

.close img {
    width: 2.40625rem;
}

/*首页*/
.indexbox {
    width: 100%;
    height: 100%;
    float: left;

}

.swiper-container {
    width: 100%;
    height: 100%;
    float: left;
}

.swiper-container .swiper-slide {
    width: 100%;
    height: 100%;
    float: left;
}

.swiper-container .swiper-slide .ani img {
    max-width: 94%;
    margin-top: 3rem;
    margin-left: 3%;
}

.swiper-container .swiper-slide .ani.in3 img {
    margin-top: 1rem;
}

.indexbox .resize {
    width: 2.03125rem;
    position: fixed;
    bottom: 0.3rem;
    left: 50%;
    margin-left: -1.015625rem;
    z-index: 9999;
    -webkit-animation: sdb05 1.5s infinite;
    animation: sdb05 1.5s infinite;
}

.go_home {
    width: 100%;
    float: left;
    text-align: center;
}

.go_home span {
    width: 5.375rem;
    height: 2.5rem;
    background: url(../images/linkbg.png) no-repeat center center / 5.375rem;
    display: inline-block;
    text-align: center;
    line-height: 2.3rem;
    font-size: 0.875rem;
    color: #00377a;
}

.go_home span a {
    color: #00377a;
}

/*弹出事件*/
.sharebox {
    width: 100%;
    min-height: 100%;
    height: auto;
    float: left;
    background: url("../images/share.jpg") no-repeat left top / 100% 100%;;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 999;
    display: none;
}

/*领奖信息弹出*/
.usermask {
    width: 100%;
    height: 100%;
    float: left;
    background: url("../images/alertbg.jpg") no-repeat left top / 100% 100%;;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 919;
    display: none;
}

/*抽奖次数*/
.alertint {
    width: 100%;
    float: left;
    height: 100%;
    background: url("../images/alertbg.jpg") no-repeat left top /  100% 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 888;
    display: none;
}

.tsk {
    width: 12.25rem;
    height: 9.71875rem;
    background: url("../images/tsk.png") no-repeat center center / 12.25rem;
    position: absolute;
    left: 50%;
    margin-left: -6.125rem;
    float: left;
    top: 8rem;
    text-align: center;
    font-size: 1.2rem;
    line-height: 2rem;
    color: #00377a;
    padding-top: 2.5rem;
}

.alertint .link_btn {
    bottom: auto;
    top: 19rem;
}
/*媒体查询*/
@media (max-width: 383px) {
    .go_btn {
        bottom: 8.2rem !important;
    }

    .go_active {
        bottom: 7.4rem !important;
    }

    .prize {
        top: 12.7rem !important;
    }

    .userbg .usercont h2 {
        letter-spacing: 4px !important;
    }
}

@media (max-width: 360px) {
    .go_btn {
        bottom: 8rem !important;
    }

    .go_active {
        bottom: 7rem !important;
    }

    .prize {
        top: 12.1rem !important;
    }

    .userbg .usercont h2 {
        letter-spacing: 2px !important;
    }
}

@media (max-width: 384px) {
    .go_btn {
        bottom: 8rem;
    }

    .go_active {
        bottom: 7rem;
    }

    .prize {
        top: 12.3rem;
    }

    .userbg .usercont h2 {
        letter-spacing: 2px;
    }
}

@media (min-width: 410px) {
    .prize {
        top: 12.6rem;
    }
}

@media (min-width: 600px) {
    .go_btn {
        bottom: 7.9rem;
    }

    .go_active {
        bottom: 7rem;
    }

    .prize {
        top: 12.2rem;
        margin-left: -5.3rem;

    }
}

@media (min-width: 768px) {
    .go_btn {
        bottom: 9.4rem;
    }

    .go_active {
        bottom: 8.5rem;
    }

    .btn .go_block {
        width: 8.125rem;
        background: url("../images/go_black.png") no-repeat center center / 8.125rem;
    }

    .btn .share {
        width: 8.125rem;
        background: url("../images/share.png") no-repeat center center / 8.125rem;
    }

    .prize {
        width: 12.125rem;
        background: url("../images/prize.png") no-repeat center center /12.125rem;
        top: 14.8rem;
        margin-left: -6.1625rem;
        height: 8.0625rem;
    }

    .prize .prize_txt p {
        padding-top: 1.9rem;
    }

    .prize .prize_yes .prize_top {
        padding-left: 5rem;
    }

    .prize .prize_yes .prize_top img {
        width: 2.5rem;
        top: 2.8rem;
        left: 1.5rem;
    }

    .prize_yes .ties {
        padding-top: 1.3rem;
    }

    .userbg img {
        max-width: 80%;
        margin-left: 10%;
    }

    .userbg .usercont {
        padding: 3rem 5rem;
    }

    .userbg .usercont h2 {
        letter-spacing: 3px;
        font-size: 0.875rem;
        line-height: 1.5rem;
    }

    .link_btn {
        bottom: 1.4rem;
    }
}

/*动画效果*/
@keyframes zoomInDown {
    from {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    }
}

@-webkit-keyframes zoomInDown {
    from {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    }
}

@-webkit-keyframes sdb05 {
    0% {
        -webkit-transform: rotate(0deg) translate(0, 0);
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        -webkit-transform: rotate(0deg) translate(0px, -20px);
        opacity: 0;
    }
}

@keyframes sdb05 {
    0% {
        transform: rotate(0deg) translate(0, 0);
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        transform: rotate(0deg) translate(0px, -20px);
        opacity: 0;
    }
}